header{
    top: 0;
    height: 4.5rem;
    z-index: 1;
    position: relative;

}

header>div:first-child>i::before,header>div:last-child>i::before{
    font-size: 5rem;
}

header>div{
    /*border: 1px solid red;*/
}

header>div:first-child{
    flex-grow: 1;
}

header>div:nth-child(2){
    flex-grow: 10;
}

header>div:nth-child(3){
    flex-grow: 1;
}


/*轮播图部分*/
.banner{
    background: tan;
    width: 39rem;
    margin: 0 auto;
    margin-top: 4.5rem;
    overflow: hidden;

}

.banner>div{
    width: calc(39rem*3);
    display: flex;
    animation: banner_img 10s infinite;
}

.banner>div>img{
    width: 39rem;
}

@keyframes banner_img{
    35%{
        margin-left: -39rem;
    }

    70%{
        margin-left: calc(-39rem * 2);
    }

    100%{
        margin-left: calc(-39rem * 3);
    }
}


/*首页商品推荐部分*/
.recomment{
    width: 39rem;
    margin: 1rem auto;
    padding: 1.5rem 0.5rem 2rem;
}

.recomment>div>a>img{
    width: 7rem;
    margin-bottom: 1rem;
}

.nav>div{
    width: 13rem;
    height: 4rem;

}

.nav>div:first-child>span{
    border-bottom: 0.3rem solid var(--bgcolor-ffa666);
    padding-bottom: 0.6rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}


/*商品区域*/
.goods{
    margin-bottom: 6rem;
    flex-flow: wrap;

}

.goods > div{
    width: calc(38rem / 2);
    box-sizing: border-box;
    box-shadow: 0.2rem 0.3rem 0.3rem var(--box-shadow-e9);
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

.goods > div > a > img{
    width: 100%;
}

/*图标*/
.goods > div > a > div > span:last-child > i:before{
    font-size: 1rem;
    margin-left: 0.8rem;
    margin-right: 0.3rem;
}



/*返回顶部*/
.top{
    width: 4rem;
    height: 4rem;
    background: url("../img/5.png") no-repeat center;
    position: fixed;
    right: 3rem;
    bottom: 8rem;
    border-radius: 50%;
}


/*底部导航栏样式*/
nav{
    width: 100%;
    height: 5rem;
    bottom: 0px;
}

nav>div{
    display: flex;
    height: 100%;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
}


nav>div:nth-child(2)>a>i:before{
    font-size: 1.2rem;
}

nav>div:nth-child(3)>a>i:before{
    font-size: 1.2rem;
}

/*购物车数量*/
nav>div:nth-child(3)>a{
    position: relative;
}

nav>div:nth-child(3)>a>span:first-child{
    background: red;
    color: #fff;
    border-radius: 50%;
    position: absolute;
    padding: 0rem 0.3rem;
    top: -1.3rem;
    right: 0.8rem;

}




